﻿<div class="row" data-ng-controller="teamDetailCtrl">
      <!-- <div id="loadingWidget" class="row-fluid ui-corner-all" style="padding: 0 .7em;" loading-widget >
        <div class="loadingContent">
            <p>
                <img alt="Loading  Content" src="images/ajax-loader.gif" /> Loading
            </p>
        </div>
    </div>-->

    <div  class="col-md-12" data-ng-cloak>
        <h2>{{teamTitle}}</h2>
        <div class="row">
            <!--   <alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">{{alert.msg}}</alert>-->
            <div class="col-md-10">
                <h2>Team Members</h2>
                <div class="table-responsive">
                <table id="members" class="table table-striped table-bordered table-condensed">
                    <thead>
                        <tr>
                            <th class="btn-toolbar"><i class="btn glyphicon glyphicon-plus" data-ng-click="toggleAddMode()" id="AddTeamMember">Add</i></th>
                            <th class="hidden-xs">Picture</th>
                            <th>Name</th>
                            <th>Email</th>
                            <th>Phone</th>
                            <th>Role</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr data-ng-show="addMode" id="addMode">
                            <td style="width: 50px">
                                <div class="btn-toolbar">
                                    <div class="btn-group">
                                        <i class="btn glyphicon glyphicon-save" id="addSave" data-ng-click="addTeamMember(team.people_TeamMember)"></i>
                                        <i class="btn glyphicon glyphicon-remove" id="addRemove" data-ng-click="toggleAddMode()"></i>
                                    </div>
                                </div>
                            </td>
                            <td class="hidden-xs">
                                <img src="~/Images/person2.jpg" /></td>
                            <td>
                                <input type="text" id="addName" title="{{team.people_TeamMember.person.name}}" data-ng-model="team.people_TeamMember.person.name" required />
                            </td>
                            <td>
                                <input type="text" id="addEmail" title="{{team.people_TeamMember.email}}" data-ng-model="team.people_TeamMember.email" />
                            </td>
                            <td>
                                <input type="text" id="addPhone" title="{{team.people_TeamMember.phone}}" data-ng-model="team.people_TeamMember.phone" />
                            </td>
                            <td>
                                <select data-ng-model="team.people_TeamMember.defaultTeamRoleId" data-ng-options="c.lookupID as c.title for c in roles">
                                    <option value="">-- chose role --</option>
                                </select>
                                <input type="hidden" data-ng-model="team.people_TeamMember.defaultTeamRoleId" value="{{selectedItem.lookupID}}" />
                            </td>
                        </tr>
                        <tr id="teamMembers" data-ng-repeat="TeamMember in team.people_TeamMember ">
                            <td style="width: 50px">
                                <div class="btn-toolbar" data-ng-show="TeamMember.editMode == null || TeamMember.editMode == false">
                                    <div class="btn-group">
                                        <i id="editMember" class="btn glyphicon glyphicon-edit" data-ng-click="toggleEditMode(TeamMember)"></i>
                                        <i id="undoMember" class="btn glyphicon glyphicon-trash" data-ng-click="deleteTeam(TeamMember)"></i>
                                    </div>
                                </div>
                                <div class="btn-toolbar" data-ng-show="TeamMember.editMode == true">
                                    <div class="btn-group">
                                        <i id="saveMember" class="btn glyphicon glyphicon-save" data-ng-click="updateTeam(TeamMember)"></i>
                                        <i id="deleteMember" class="btn glyphicon glyphicon-remove" data-ng-click="toggleEditMode(TeamMember)"></i>
                                    </div   
                                </div>
                            </td>
                            <td class="hidden-xs">
                                <img src="../../Images/person2.jpg" /></td>
                            <td>

                                <span data-ng-show="TeamMember.editMode == null || TeamMember.editMode == false">{{TeamMember.person.name}}</span>
                                <input id="editName" type="text" data-ng-show="TeamMember.editMode == true" title="{{TeamMember.person.name}}" data-ng-model="TeamMember.person.name" required />
                            </td>
                            <td>
                                <span data-ng-show="TeamMember.editMode == null || TeamMember.editMode == false">{{TeamMember.email}}</span>
                                <input id="editEmail" type="text" data-ng-show="TeamMember.editMode == true" title="{{TeamMember.email}}" data-ng-model="TeamMember.email" />
                            </td>
                            <td>
                                <span data-ng-show="TeamMember.editMode == null || TeamMember.editMode == false">{{TeamMember.phone | tel}}</span>
                                <input id="editPhone" type="text" data-ng-show="TeamMember.editMode == true" data-ng-model="TeamMember.phone" />

                            </td>
                            <td>

                                <span data-ng-show="TeamMember.editMode == null || TeamMember.editMode == false">{{TeamMember.lookup}}</span>
                                <select id="editRole" data-ng-show="TeamMember.editMode == true" data-ng-model="TeamMember.defaultTeamRoleId" data-ng-options="c.lookupID as c.title for c in roles">
                                    <option value="">-- chose role --</option>

                                </select>
                                <input type="hidden" data-ng-model="TeamMember.defaultTeamRoleId" value="{{selectedItem.lookupID}}" />
                            </td>

                        </tr>
                    </tbody>
                </table>
                    </div>

            </div>
        </div>
        <div class="row">
            <div class=" span2">
            </div>
            <div class="col-md-10">
                <h2>Team Incidents</h2>

                <table class="team.incidents table table-striped table-bordered table-condensed">
                    <thead>
                        <tr>
                            <th>Title</th>
                            <th>Date</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr data-ng-repeat="incident in team.incidents">
                            <td><a href="#/Incidents/{{incident.id}}">
                                <label>{{incident.title}}</label></a></td>
                            <td>
                                <label>{{incident.dateOfIndicent | date:'short'}}</label></td>
                        </tr>
                </table>
            </div>
        </div>
    </div>
</div>
